<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <title>mb</title>
    <style>
        body, html {
            width: 100%;
            height: 100%;
        }

        #box{
            width: 500px;
            height: 300px;
            background-color: rgba(219, 224, 232, 0.25);
            padding-top: 50px;
            border-radius: 10px;
            margin:300px auto;
            display: none;
        }

        #txt{
            display: block;
            margin:10px auto;
            font-size: 45px;
            width: 250px;
            text-align: center;
        }

        #span{
            display: block;
            margin:10px auto;
            font-size: 20px;
            color: white;
            text-align: center;
        }
        #button{
            display: block;
            margin:30px auto;
            width: 120px;
            height: 54px;
            font-size: 22px;
        }

        img{
            margin:0px auto;
            width : 100%;
            height : 100%;
        }

        #phoneBg{
            margin:0px auto;
            background-repeat: no-repeat;
            width : 100%;
            height : 100%;
        }

    </style>
</head>
<body style="background-color: black" onload="time()">

    <div id="box">
        <div id="span">请输入验证码</div>
        <input id = "txt" type="text">
        <input id = "button" type="button" value="确 定" onclick="foo()">
    </div>

    <div id="phoneBg">
        <img src="phoneBg.jpg">
    </div>

<script>

    function time(){
        let e = document.getElementById("phoneBg");
        let eWidth = e.offsetWidth;
        if(eWidth>1000){
            e.style.width = "30%";
        }
        window.setTimeout(none, 2500);
    }
    function none(){
        let e = document.getElementById("phoneBg");
        e.style.display = "none";

        e = document.getElementById("box");
        e.style.display = "block";
    }

    function foo() {
        let inputMsg = document.getElementById("txt").value;
        let randCode = eval(inputMsg*1357);
        window.location.replace("index.html?id=" + randCode);
    }



</script>
</body>
</html>
